<template>
  <div id="xiaoxi">
    <BackHeader :header="Header"></BackHeader>
    <div class="mt40">
      <mt-tab-container>
        <div class="row bg2" v-if="have">
          <div class="col-6 mt10" v-for="(item,index) in fabuData" :key="index">
            <div class="card" style="height:155px;width:155px" >
              <img :src="item.imgs" class="card-img-top" alt="Card image cap" height="90px" @click="mainmsg1(index)">
              <h6 class="card-title lue_2 title1 text-center">{{item.title}}</h6>
              <mt-button size="small" type="danger" @click="deleteMyFabu(index)">删除</mt-button>
            </div>
          </div>
        </div>
        <div class="row bg2" v-if="!have">
          <div class="ptext">你没有发布文章喔！</div>
        </div>
      </mt-tab-container>
    </div>
  </div>
</template>
<script>
import BackHeader from "../../components/Header/BackHeader.vue";
import CommonProvider from "@/providers/CommonProvider";
import MemberCenterProvider from "@/providers/MemberCenterProvider";
import { Toast } from "mint-ui";
export default {
  name: "xiaoxi",
  data() {
    return {
      Header: "我的发布",
      fabuData: [],
      have: false
    };
  },
  components: {
    BackHeader
  },
  mounted(){
    this.init()
  },
  methods: {
     mainmsg1(index) {
      window.localStorage.setItem("main_ID", this.fabuData[index].id);
      this.$router.push("/details");
    },
    init(){
       MemberCenterProvider.checkLogin().then(res=>{
         let data = {
           publish_man: res.data.userName
          }
         CommonProvider.myFabu(data).then(res => {
           this.fabuData = res.data
           if(this.fabuData.length > 0){
             this.have = true
           } else {
             this.have = false
           }
         })
       })
      
    },
    deleteMyFabu(index){
      let data3 = {
        id: this.fabuData[index].id
      };
      CommonProvider.DelmyFabu(data3).then(res => {
        (this.open = true), Toast("删除成功！");
        this.init()
      });
    }
  }
};
</script>
<style lang='scss' scoped>
.ptext{
  margin: 30px;
}
</style>